$(document).ready(function() {
	bindSubtotalUpdates();
	formatDisplayedAmounts();
});
$(document)
		.ready(
				function() {
					$('#addIncomeItemButton')
							.click(
									function(event) {
										// Get highest index
										var highestIndex = 0;
										$('*[id*=incomeItemRow_]')
												.each(
														function() {

															var currentIndex = this.id
																	.substring(14);
															if (currentIndex > highestIndex)
																highestIndex = currentIndex;
														});
										var newIndex = Number(highestIndex) + 1;

										// Add a new incomeItemRow using the
										// next index
										$(buildNewIncomeRowHtml(newIndex))
												.insertBefore(
														'#addIncomeItemButtonRow');

										bindSubtotalUpdates();
									});

					$('#addExpenseItemButton')
							.click(
									function(event) {
										// Get highest index
										var highestIndex = 0;
										$('*[id*=expenseItemRow_]')
												.each(
														function() {

															var currentIndex = this.id
																	.substring(15);
															if (currentIndex > highestIndex)
																highestIndex = currentIndex;
														});
										var newIndex = Number(highestIndex) + 1;

										// Add a new expenseItemRow using the
										// next index
										$(buildNewExpenseRowHtml(newIndex))
												.insertBefore(
														'#addExpenseItemButtonRow');

										var cloned = $(
												'#expenseItems0\\.expenseCategory\\.categoryId')
												.clone();
										cloned
												.attr(
														'id',
														'expenseItems'
																+ newIndex
																+ '.expenseCategory.categoryId');
										cloned
												.attr(
														'name',
														'expenseItems['
																+ newIndex
																+ '].expenseCategory.categoryId');
										cloned
												.appendTo($('#expenseItemCategoryCell_'
														+ newIndex));

										bindSubtotalUpdates();
									});
				});

function updateIncomeSubtotal() {
	$.post("secure/manage/incomeTotal", $("#incomeForm").serialize(), function(
			incomeTotal) {
		$('#incomeSubtotal').html(incomeTotal);
		formatDisplayedAmounts();
	});
}

function updateExpenseSubtotal() {
	$.post("secure/manage/expenseTotal", $("#incomeForm").serialize(),
			function(expenseTotal) {
				$('#expenseSubtotal').html(expenseTotal);
				formatDisplayedAmounts();
			});
}

function bindSubtotalUpdates() {
	$('*[id*=incomeItems]').change(function() {
		updateIncomeSubtotal();
	});

	$('*[id*=expenseItems]').change(function() {
		updateExpenseSubtotal();
	});
}

function formatDisplayedAmounts() {
	$('#incomeSubtotal').formatCurrency({
		roundToDecimalPlace : 0
	});

	$('#expenseSubtotal').formatCurrency({
		roundToDecimalPlace : 0
	});
}

function buildNewIncomeRowHtml(newIndex) {
	var newRowHtml = '<tr id="incomeItemRow_' + newIndex + '">';
	newRowHtml += '<td><input id="incomeItems' + newIndex
			+ '.incomeItemId" name="incomeItems[' + newIndex
			+ '].incomeItemId" type="hidden" value="">';
	newRowHtml += '<input id="incomeItems' + newIndex
			+ '.description" name="incomeItems[' + newIndex
			+ '].description" type="text" value="" size="20"></td>';
	newRowHtml += '<td><input id="incomeItems' + newIndex
			+ '.amount" name="incomeItems[' + newIndex
			+ '].amount" type="text" value="" size="8"></td>';
	newRowHtml += '</tr>';

	return newRowHtml;
}

function buildNewExpenseRowHtml(newIndex) {
	var newRowHtml = '<tr id="expenseItemRow_' + newIndex + '">';
	newRowHtml += '<td><input id="expenseItems' + newIndex
			+ '.expenseItemId" name="expenseItems[' + newIndex
			+ '].expenseItemId" type="hidden" value="">';
	newRowHtml += '<input id="expenseItems' + newIndex
			+ '.description" name="expenseItems[' + newIndex
			+ '].description" type="text" value="" size="20"></td>';
	newRowHtml += '<td id="expenseItemCategoryCell_' + newIndex + '"></td>';
	newRowHtml += '<td><input id="expenseItems' + newIndex
			+ '.amount" name="expenseItems[' + newIndex
			+ '].amount" type="text" value="" size="8"></td>';
	newRowHtml += '<td>&nbsp;</td></tr>';

	return newRowHtml;
}